<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.6/css/bootstrap.min.css">
</head>
<body class="white-bg">
<input hidden type="text">
<div style="padding: 50px">
    <div class="rendered-form">
        <label for="form-data-title" class="formbuilder-text-label">工单标题</label>
        <input id="form-data-title" class="form-control" type="text" name="title" required="required">
    </div>
    <div class="render-wrap"></div>
</div>

<th:block th:include="include :: footer" />
<script src="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.11.4/jquery-ui.min.js"></script>
<script src="https://formbuilder.online/assets/js/form-builder.min.js"></script>
<script src="https://formbuilder.online/assets/js/form-render.min.js"></script>
<script th:inline="javascript">
    var formData = [[${formData}]];
    //过滤掉按钮
    var formDataArr = JSON.parse(formData);
    for(var i=0; i<formDataArr.length; i++){
        var item = formDataArr[i]
        if(item.type=="button"){
            item.style="display:none";
        }
    }
    var formRenderInstance;
    jQuery(function($) {
        formRenderInstance = $('.render-wrap').formRender({formData:JSON.stringify(formDataArr)});//渲染数据
    });
    function submitHandler(formId,index, layero) {
        var jsonData = formRenderInstance.userData;
        var title = $("#form-data-title").val();
        for(var i=0; i<jsonData.length; i++){
            var item = jsonData[i]
            if(item.type=="button"){
                item.style="";
            }
        }
        $.operate.save("/form/data/save",{data:JSON.stringify(jsonData),formId:formId,title:title});
    }
</script>
</body>
</html>